﻿@using Enter.Admin.Utils
@using Enter.Admin.Enums
@using Enter.Admin.Dtoes
@using Enter.Admin.Models.DataTables
@{
    ViewData["Title"] = "消息中心";
    var columns = DataTablesColumnExt.ToList<NoticeModel>();
}
@section Styles {
    <link href="~/plugins/datatables.net-bs4/css/dataTables.bootstrap4.min.css" rel="stylesheet" />
    <link href="~/plugins/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css" rel="stylesheet" />

    <link href="~/plugins/datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css" rel="stylesheet" />

    <link href="~/plugins/dropzone/dist/min/dropzone.min.css" rel="stylesheet" />
    <link href="~/plugins/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet" />
}
@section Scripts {
    <script src="~/plugins/datatables.net/js/jquery.dataTables.min.js"></script>
    <script src="~/plugins/datatables.net-bs4/js/dataTables.bootstrap4.min.js"></script>
    <script src="~/plugins/datatables.net-responsive/js/dataTables.responsive.min.js"></script>
    <script src="~/plugins/datatables.net-responsive-bs4/js/responsive.bootstrap4.min.js"></script>
    <script src="~/plugins/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
    <script src="~/plugins/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js"></script>

    <script src="~/plugins/dropzone/dist/min/dropzone.min.js"></script>
    <script src="~/plugins/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
    <script src="~/plugins/sweetalert/dist/sweetalert.min.js"></script>
    <script>
        var searchObj = function () {
            return {}
        }
        var columns = @Html.Raw(Jsons.Serialize(columns));
        //columns.push({ data: "Id", title: "操作", orderable: false })

        var noticeDataTable = null
        var handleDataTableDefault = function () {
            if ($('#data-table-default').length !== 0) {
                noticeDataTable = $('#data-table-default').DataTable({
                    dom: 'lBrtip',//'',// 'iCflrtp',//'Bfrtip',
                    buttons: [
                        //{
                        //    text: '全部已读 <i class="fa fa-plus"></i>',
                        //    className:'btn btn-primary',
                        //    action: function (e, dt, node, config) {
                        //    }
                        //}
                    ],
                    "lengthMenu": [[10, 25, 50], [10, 25, 50]],
                    responsive: isMobile, //是否显示全部
                    "searching": false,//datatables自带的搜索
                    "processing": true,//加载中
                    "serverSide": true,
                    "ajax": {
                        type: "POST",
                        url: '@Url.Action("Index", "Notice")',
                        contentType: "application/json; charset=utf-8",
                        async: true,
                        data: function (data) {
                            data.Data = searchObj()
                            return JSON.stringify(data);
                        }
                    },
                    rowId: 'Id',
                    columns: columns,
                    "columnDefs": [
                        {
                            "targets": 0,//-1表示最后一行 也可以是数组，"visible": false,"searchable": false
                            //"width": "250px",
                            render: function (data, type, full, meta) {
                                var title = full.Title
                                if (!full.Readed) {
                                    title = title+" (未读)"
                                }
                                var html_c = '<a style="margin-left: 10px;" href="javascript:;" onclick="show_notice(' + full.Id + ')" >' + title + '</a>';
                                return html_c;
                            }
                        }
                    ],
                    "language": datatable_language
                });
            }
        };

        $(document).ready(function () {
            handleDataTableDefault();
        });

    </script>
}

<!-- begin breadcrumb -->
<ol class="breadcrumb float-xl-right">
    <li class="breadcrumb-item active">消息中心</li>
</ol>
<!-- end breadcrumb -->
<!-- begin page-header -->
<h1 class="page-header">消息中心 <small>...</small></h1>
<!-- end page-header -->
<!-- begin panel -->
<div class="panel panel-inverse">
    <!-- begin panel-heading -->
    <div class="panel-heading">
        <h4 class="panel-title">消息列表</h4>
    </div>

    <!-- begin panel-body -->
    <div class="panel-body">
        <table id="data-table-default" class="table table-striped table-bordered table-td-valign-middle display nowrap" style="width:100%">
        </table>
    </div>
    <!-- end panel-body   -->
</div>
<!-- end panel -->
